<template>
  <div class="app-container roam-use-detail">
    <!-- 工具栏 -->
    <div class="head-container">
      <div v-if="crud.props.searchToggle">
        <el-input
          placeholder="请输入药品名称"
          v-model="query.drugName"
          style="width: 140px"
          class="filter-item"
          size="small"
        />
        <el-input
          placeholder="请输入订单号"
          v-model="query.orderNo"
          style="width: 140px"
          class="filter-item"
          size="small"
        />
        <rrOperation :crud="crud"/>
      </div>
      <crudOperation></crudOperation>
    </div>
    <!-- 表格渲染 -->
    <el-table
      v-loading="crud.loading"
      :data="crud.data"
    >
      <el-table-column
        type="index"
        width="50">
      </el-table-column>
       <el-table-column
        v-if="columns.visible('apiOrderNo')"
        label="订单号"
        prop="apiOrderNo"
      />
      <el-table-column
        v-if="columns.visible('drugName')"
        label="药品名称"
        prop="drugName"
      />
      <el-table-column
        v-if="columns.visible('toStoreName')"
        label="流转药房名称"
        prop="toStoreName"
      />
      <el-table-column
        v-if="columns.visible('toDrugName')"
        label="流转药品名称"
        prop="toDrugName"
      />
      <el-table-column
        v-if="columns.visible('num')"
        label="流转数量"
        prop="num"
      >
      <template slot-scope="scope">
                    <template v-if="scope.row.num > 0">
                      {{ scope.row.num + scope.row.unit }}
                    </template>
                    <template v-else>0</template>
                    <!-- <template v-else>{{ scope.row.refundCount }}</template> -->
                  </template>
      </el-table-column>
      <el-table-column
        v-if="columns.visible('refundCount')"
        label="退款数量"
        prop="refundCount"
      >
       <template slot-scope="scope">
                    <template v-if="scope.row.refundCount > 0">
                      {{ scope.row.refundCount + scope.row.unit }}
                    </template>
                    <template v-else>0</template>
                    <!-- <template v-else>{{ scope.row.refundCount }}</template> -->
                  </template>
      </el-table-column>
      <el-table-column
        v-if="columns.visible('price')"
        label="单价"
        prop="price"
      />
      <el-table-column
        v-if="columns.visible('status')"
        label="订单状态"
        prop="status" :show-overflow-tooltip="true">
         <template slot-scope="scope">{{statusByText(scope.row.status)}}</template>
      </el-table-column>
       <el-table-column
        v-if="columns.visible('orderTime')"
        label="创建时间"
        prop="orderTime"
      />
      <!-- <el-table-column
        v-if="columns.visible('createUser')"
        prop="createUser"
        label="操作员"
      /> -->
    </el-table>
    <!-- 分页组件 -->
    <pagination />
  </div>
</template>

<script>
import CRUD, { presenter, header } from "@crud/crud";
import crudOperation from "@crud/CRUD.operation";
import rrOperation from "@crud/RR.operation";
import pagination from "@crud/Pagination";

let defaultCrud = CRUD({
  title: "流转使用详情",
  url: "api/circulation/getDrugCirculationTo",
  sort: ['id,desc'],
  query: { drugName: null,orderNO:null },
});

export default {
  name: "roamUseDetail",
  components: { crudOperation, rrOperation, pagination },
  mixins: [presenter(defaultCrud), header()],
  data() {
    return {
      // 所有状态
      statusList: [
        {id: 0, text: '未支付'},
        {id: 1, text: '已支付'},
        {id: 2, text: '部分退款'},
        {id: 3, text: '已退款'}
      ],
    };
  },
  created() {},
  methods: {
     statusByText(status) {
      return this.statusList[status].text;
    },
  }
}
</script>
